/**************************************
 *
 * VLOOK™ 模板主题
 *
 * powered by MAX°孟兆
 *
 * QQ Group: 805502564
 * Telegram Channel: t.me/vlook_markdown
 * email: maxchow@qq.com
 *
 *************************************/

@import "../font";
@import "../color";
@import "../common";

// 主题信息
@themeVer: "V28.1";
@themeName: "vlook-owl";
@themeDesc: "Owl";

// 指定字体主题
.applyFontStyle(local);
// .applyFontStyle(sans);
// 指定主题配套的圆角
.applyThemeRadius(big);
// 文档背景使用图片
.applyDocBgImg(@docBgImgLight_Wave, @docBgImgDark_Wave);
// 表格、插图指定居中对齐
.genTableAndFigureAlign(center);
// 生成指定的表格样式
.genTableStyle(modern);

:root {
    --thm-fav-logo-lg: url("");
    --thm-fav-logo-dk: url("");
}

// 主题主色
@theme1: #04AAC2;//#10A8BE;
@theme2: #7735CC;
@theme3: #48F0EE;//#10DAD8;
@theme1Dark: #04B7D1;//#0F9EB3;
@theme1Alt: #D0F6FB;
@theme1AltDark: #005175;
@theme2Dark: #935ED6;
@theme2Alt: #E4D6F5;
@theme2AltDark: #462D66;
@theme1Fade: rgba(red(@theme1), green(@theme1), blue(@theme1), @accOpacity);
@theme2Fade: rgba(red(@theme2), green(@theme2), blue(@theme2), @accOpacityHighForDk);
@theme2FadeDark: rgba(red(@theme2Dark), green(@theme2Dark), blue(@theme2Dark), 75%);

@themeForeColor: @theme1;
@themeForeColorFade: fade(@themeForeColor, 50%);
@themeBgColor: @theme1;
@themeBgColorFade: fade(@themeBgColor, 50%);
@themeBgColorDark: darken(@themeBgColor, 20%);
@themeBgColorAlt: lighten(@themeBgColor, 40%);

// 标题色
@headerColor: @theme1;
@headerColorDark: @theme1Dark;

@hbgC1: rgba(16, 168, 190, .3);
@hbgC2: rgba(119, 53, 204, .2);
@hbgLg: ~"linear-gradient(270deg, @{hbgC1}, @{hbgC2} 30%, @{hbgC2} 50%, @{hbgC2} 70%, @{hbgC1})";
@spliterWidth: 4px;

// 渐变标题色 h1-h5
@lg: linear-gradient(135deg, var(--ac-t1) 35%, var(--ac-t2));
.genLinearGradientHeader(h1, @lg);
.genLinearGradientHeader(h2, @lg);
.genLinearGradientHeader(h3, @lg);
.genLinearGradientHeader(h4, @lg);
.genLinearGradientHeader(h5, @lg);

// 6 级标题前缀内容
@h6BeforeContent: "◎" @h6NumSeparator;

// 标题背景色
@h1Bg: linear-gradient(180deg, rgba(var(--fade-r), var(--fade-g), var(--fade-b), .1), rgba(var(--fade-r), var(--fade-g), var(--fade-b), 1)), @hbgLg;
@h2Bg: @h1Bg;
@h3Bg: linear-gradient(to right, transparent 20%, @hbgC2 20%, @hbgC1 50%, @hbgC2 80%, transparent 80%) 0 0 / 100% 5px no-repeat;

@headerTextAlign: center;
@headerPadding: 20px 5px 5px;
@h1Margin: 3em 0 0 0;
@h2Margin: 3em 0 0 0;
@h3Margin: 2.5em 0 0 0;
@h4Margin: 2.5em 0 0 0;
@h5Margin: 1.5em 0 0 0;
@h6Margin: 1em 0 0 0;

// 自定义标题自动编号
@h1NumSeparator: "";
@vHeaderAutoNum: "h1{{第###章}}";
@h1BeforeContent: "第" counter(h1) "章";

// h1-6::before 的扩展样式
.genH1beforeExt() {
    display: block;
    font-size: 2em;
    font-weight: normal;
}

// 引用块默认色样式（与主题配套使用）
@quoteBgDefault: linear-gradient(0deg, var(--d-bc), var(--blockquote-bg));
@quoteBoxShadowDefault: 0 0 0 1px var(--blockquote-bg) inset;

// 按钮色
@buttonForeColor:#FFFFFF;
@buttonForeHoverColor: @theme3;
@buttonBgColor: @themeBgColor;
// 文库按钮颜色
@docLibButtonForeColor: @buttonForeColor;
@docLibButtonForeHoverColor: @buttonForeHoverColor;
@docLibButtonBgColor: @buttonBgColor;
// 指定 kbd 按钮风格
.applyKbdRadius(big);

// 链接颜色
@aBorderWidth: 2px;
@aColor: @headerColor;
@aColorDark: @headerColorDark;
// @alinecolor: @theme2;
@aHoverColor: @theme2;
@aHoverColorDark: @theme2Dark;
@aActiveColor: desaturate(@aHoverColor, 25%);

// 封面内多级标签样式
@badgeBorderColorInCover: fade(@coverSubColor, 50%);
@badgeBorderWidthInCover: 1px;

// 封面、封底文字位置及对齐方式
@coverTextAlign: center;
@coverTextPadding: 180px 60px 0;
@coverTextPaddingForMobile: 180px 20px 0;
@coverTextColor: @theme3;
@coverSubColor: #FFFFFF;
@coverUnderlineColor: @coverSubColor;
@coverAuthorColor: @coverUnderlineColor;
@coverOwnerColor: @coverAuthorColor;

@backcoverTextAlign: @coverTextAlign;
@backcoverTextPadding: 240px 60px 0;
@backcoverTextPaddingForMobile: 240px 20px 0;
@backcoverTextColor: @coverTextColor;

// 对比度边框色，用于主题色与背景色对比度比较低时的边缘视觉识别
@contrastBorder: 0 0 0 0 transparent;
@contrastBorderForCover: 0 0 0 2px rgba(0, 218, 216, .2) inset;

// 封面背景设置
@coverBackgroundColor: #2E1F47;
@coverBackgroundImage: var(--thm-c-logo), var(--thm-c-w), var(--thm-c-w2), var(--thm-c-bg);
@coverBgSize: auto, auto, auto, auto;
@coverBgSizeForMobile: auto, 380px 150px, 450px 260px, auto;
@coverBackgroundSize: var(--thm-c-bg-size);
@coverBackgroundRepeat: no-repeat, no-repeat, no-repeat, repeat;
@coverBgPosition: center 80px, top left, bottom right, top left;
@coverBgPositionForMobile: @coverBgPosition;
@coverBackgroundPosition: var(--thm-c-bg-pos);

// 封底背景设置
@backcoverBackgroundColor: @coverBackgroundColor;
@backcoverBackgroundImage: var(--thm-c-logo), var(--thm-c-w), var(--thm-bc-w-r), var(--thm-c-bg);
@backcoverBgSize: auto, auto, auto, auto;
@backcoverBgSizeForMobile: auto, 380px 150px, 450px 170px, auto;
@backcoverBackgroundSize: var(--thm-bc-bg-size);
@backcoverBackgroundRepeat: @coverBackgroundRepeat;
@backcoverBgPosition: center 120px, top left, bottom right, top left;
@backcoverBgPositionForMobile: @backcoverBgPosition;
@backcoverBackgroundPosition: var(--thm-bc-bg-pos);

// 文档扩展区域背景
@docExtBackgroundImage: var(--thm-doc-ext-bg1), var(--thm-doc-ext-bg2),  var(--thm-doc-ext-bg);
@docExtBackgroundSize: auto, auto, auto;
@docExtBackgroundRepeat: no-repeat, no-repeat, no-repeat;
@docExtBackgroundPosition: left top, right bottom, left top;

// 封面、封底素材资源
:root {
    // Logo
    --thm-c-logo: url("");
    // 顶部小波浪
    --thm-c-w: url("");
    // 底部大波浪
    --thm-c-w2: url("");
    // 图片纹理
    --thm-c-bg: @docBgImgDark_Wave;
    // 底部反向小波浪
    --thm-bc-w-r: url("");
    // doc-ext
    --thm-doc-ext-bg1: url("");
    --thm-doc-ext-bg2: url("");
}

@import "../base";

// // 封面装饰文本样式 before
// @{coverAfterYAML}::before,
// @{coverWithoutYAML}::before,
// @{coverAfterYAML}::after,
// @{coverWithoutYAML}::after {
//     content: "°⚬" !important;
//     position: absolute;
//     left: 70px;
//     top: 150px;
//     color: @coverTextColor;
//     font-size: 5em;
//     font-weight: 100;
//     opacity: .5;
// }

// // 封面装饰文本样式 after
// @{coverAfterYAML}::after,
// @{coverWithoutYAML}::after {
//     content: "⚬°" !important;
//     text-align: right;
//     left: auto;
//     top: 380px;
//     right: 90px;
//     color: @coverTextColor;
//     font-size: 3.5em;
// }

// 生成加粗文本扩展样式
.genExtBoldText();
// 生成下划线文本扩展样式
.genExtUnderText();
// 生成高亮文本扩展样式
.genExtHighlightText(@quoteBeforeImage_c01, @quoteAfterImage_c01, .8);

// 生成强调风格的有序列表样式
.genOrderList(block, circle);

// 生成指定风格的多级标签样式
.genBadgeStyle(std);

// 生成 GSA 样式
.genGSA_flat();
